<template>
    <div id="mFriends">这是找合租界面
        <button @click="close">453567567</button>
    <!-- 侧滑导航根容器 -->
    <div class="mui-off-canvas-wrap mui-draggable">
        <!-- 菜单容器 -->
        <aside class="mui-off-canvas-left">
            <div class="mui-scroll-wrapper">
                <div class="mui-scroll">
                    <!-- 菜单具体展示内容 -->
                   <button @click="close">关闭</button>
                </div>
            </div>
        </aside>
        <!-- 主页面容器 -->
        <div class="mui-inner-wrap">
            <!-- 主页面标题 -->
            <header class="mui-bar mui-bar-nav">
                <a class="mui-icon mui-action-menu mui-icon-bars mui-pull-left"></a>
                <h1 class="mui-title">标题</h1>
            </header>
            <div class="mui-content mui-scroll-wrapper">
                <div class="mui-scroll">
                    <!-- 主界面具体展示内容 -->
                    <button @click="show">打开</button>
                </div>
            </div>
        </div>
    </div>
    </div>
</template>

<script>
    export default {
        name: "mFriends",
        methods:{
          show(){
              console.log("324");
              mui('.mui-off-canvas-wrap').offCanvas('show')
          }  ,
            close(){
                console.log("324");
              // mui('.mui-off-canvas-wrap').offCanvas('close');
            }
        },

        mounted() {
            // mui.init();
            // mui('.mui-off-canvas-wrap').offCanvas('show');
        }
         }
</script>

<style scoped>
    #mFriends{
        position: fixed;
        z-index: 100;
        height: 90vh !important;
    }
    html,
    body {
        background-color: #efeff4;
    }
    p {
        text-indent: 22px;
    }
    span.mui-icon {
        font-size: 14px;
        color: #007aff;
        margin-left: -15px;
        padding-right: 10px;
    }
    .mui-off-canvas-left {
        color: #fff;
    }
    .title {
        margin: 35px 15px 10px;
    }
    .title+.content {
        margin: 10px 15px 35px;
        color: #bbb;
        text-indent: 1em;
        font-size: 14px;
        line-height: 24px;
    }
    input {
        color: #000;
    }
</style>